Ext.require(['Ext.data.*', 'Ext.grid.*']);
if (Ext.grid.RowEditor) {
    Ext.apply(Ext.grid.RowEditor.prototype, {
        saveBtnText: '保存',
        cancelBtnText: '取消',
        errorsText: '错误信息',
        dirtyText: '已修改,你需要提交或取消变更'
    });
}
Ext.define('sysProg', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'id',
        useNull: true
    },  'ParentID','orderID','ProgCode', 'ProgName', 'ProgClass', 'IsGroup', 'IsCore'],
    validations: [{
        type: 'length',
        field: 'ProgName',
        min: 1
    }, {
        type: 'length',
        field: 'ParentID',
        min: 1
    }]
});

Ext.onReady(function(){
var pid;
var treestore = Ext.create('Ext.data.TreeStore', {
    root: {
    id: 'root',
        text:'系统模块',
        expanded: true
    },
    proxy: {
        type: 'ajax',
        url: 'sysprogTreeAjax.aspx'
    }
});
var treePanel = Ext.create('Ext.tree.Panel', {
    id: 'tree-panel',
    title: '系统模块',
    region: 'west',
    split: true,
    width: 250,
    minSize: 150,
    rootVisible: true,
    collapsible: true,
    floatable: true,
    autoScroll: true,
    store: treestore
});

treePanel.getSelectionModel().on('select', function(selModel, record) {
    if (!record.get('leaf')) {
        store.clearFilter(false);
        pid = record.getId()
        store.filter("ParentID",pid);
        store.load();
    }
});
    var store = Ext.create('Ext.data.Store', {
        //autoLoad: true,
        autoSync: true,
        model: 'sysProg',
        proxy: {
            type: 'ajax',
            api: {
            read: 'sysprogAjax.aspx?action=read',
            create: 'sysprogAjax.aspx?action=create',
            update: 'sysprogAjax.aspx?action=update',
            destroy: 'sysprogAjax.aspx?action=delete'
            },
            reader: {
                type: 'json' ,
                root: 'data'
            },
            writer: {
                type: 'json' ,
                root: 'data'      
            }},
        listeners: {
            write: function(store, operation){

                
            }
        }
    });
    
    var rowEditing = Ext.create('Ext.grid.plugin.RowEditing');
    
    var grid = Ext.create('Ext.grid.Panel', {
        //renderTo: document.body,
        //layout:{type:"fit"},
        plugins: [rowEditing],
//        width: 400,
        //        height: 300,
        region: 'center',
        frame: true,
        title: '模块列表',
        store: store,
        //iconCls: 'icon-user',
        defaults: { xtype: 'textfield' }, 
        columns: [{
            text: '序号',

            sortable: true,
            width:60,
            dataIndex: 'orderID',
            field: {
            xtype: 'numberfield'
            }
        }, {
            header: '分类',
            width: 80,
            sortable: true,
            dataIndex: 'IsCore',
            editor: {
                xtype: 'combobox',
                typeAhead: true,
                //triggerAction: 'all',
                selectOnTab: true,
                store: [
                    ['0', '模块'],
                    ['1', '工作流'],
                    ['2', '操作']
                ]
                ,
                lazyRender: true,
                listClass: 'x-combo-list-small'
            }
        }, {
            text: '模块名称',
            sortable: true,
            flex: 1,
            width: 100,
            dataIndex: 'ProgName',
            field: {
                xtype: 'textfield'
            }
        }, {
            text: '模块页面',
            sortable: true,
            flex: 1,
            width: 100,
            dataIndex: 'ProgClass',
            field: {
                xtype: 'textfield'
            }
        }, {
            text: '是否有下级',
            sortable: true,
            //flex: 1,
            width: 100,
            dataIndex: 'IsGroup',
            
            editor: {
                xtype: 'combobox',
                typeAhead: true,
                //triggerAction: 'all',
                selectOnTab: true,
                store: [
                    ['0', '否'],
                    ['1', '是']
                ]
                ,
                lazyRender: true,
                listClass: 'x-combo-list-small'
            }
        }],
        dockedItems: [{
            xtype: 'toolbar',
            items: [{
                text: '增加',
                iconCls: 'icon-add',
                handler: function(){
                    if(pid){
                        store.insert(0, new sysProg({ParentID:pid,IsGroup:'0',IsCore:'0',orderID:0}));
                        rowEditing.startEdit(0, 2);
                    }
                }
            }, '-', {
                itemId: 'delete',
                text: '删除',
                iconCls: 'icon-delete',
                disabled: true,
                handler: function(){
                    var selection = grid.getView().getSelectionModel().getSelection()[0];
                    if (selection) {
                        store.remove(selection);
                    }
                }
            }]
        }]
    });
    grid.getSelectionModel().on('selectionchange', function(selModel, selections){
        grid.down('#delete').setDisabled(selections.length === 0);
    });
    Ext.create('Ext.Viewport', {
        layout: {
            type: 'border',
            padding: 5
        },
        defaults: {
            split: true
        },
        items: [treePanel, grid]
        });
});
